<!doctype html>
<html>

<head>
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  <link rel="icon" href="../images/favicon.ico" type="image/x-icon">
  <link rel="stylesheet" href="../css/main.css" />
  <link rel="stylesheet" href="css/style.css" />
  <title>Bidirectional Sample</title>
</head>

<body>
  <div id="container">
    <h1>Bidirectional Sample</h1>

    <div id="warning" hidden=true></div>

    <div id="select">
      <label for="videoSource">Video source: </label><select id="videoSource"></select>
    </div>

    <div id="buttons">
      <button type="button" id="startVideoButton">Start Video</button>
      <button type="button" id="setUpButton" disabled>Set Up</button>
      <button type="button" id="hangUpButton" disabled>Hang Up</button>
    </div>

    <div id="preview">
      <div id="local">
        <h2>Local</h2>
        <video id="local_video" playsinline autoplay muted=true></video>
      </div>
      <div id="remote">
        <h2>Remote</h2>
        <video id="remote_video" playsinline autoplay></video>
      </div>
      <p>ConnectionID:<br />
        <textarea id="text_for_connection_id"></textarea>
      </p>
      <p>For more information about <code>Bidirectional</code> sample, see <a href="https://docs.unity3d.com/Packages/com.unity.renderstreaming@latest/sample-bidirectional.html">Bidirectional
          sample</a> document page.</p>
    </div>
    <section>
      <a href="https://github.com/Unity-Technologies/UnityRenderStreaming/tree/develop/WebApp/public/bidirectional" title="View source for this page on GitHub" id="viewSource">View source on GitHub</a>
    </section>
  </div>
</body>

<script type="text/javascript" src="https://webrtc.github.io/adapter/adapter-latest.js"></script>
<script src="https://unpkg.com/event-target@latest/min.js"></script>
<script src="https://unpkg.com/resize-observer-polyfill@1.5.0/dist/ResizeObserver.global.js"></script>
<script src="https://cdn.polyfill.io/v2/polyfill.min.js?features=IntersectionObserver"></script>
<script type="module" src="js/main.js"></script>

</body>

</html>